/**
 * 线
 * */

export default {
    data() {
        return {
        }
    },
    created() {
        this.handlersML = null
    },
    methods: {

        onToolML() {
            var isNew = true
            var positions = []
            var entityLine, drawLayer, dataSourceName
            var addInfoPoint = cartesian => {
                const _labelEntity = {
                    position: cartesian,
                    eventName: 'DrawTool',
                    dataSourceName: dataSourceName
                }

                _labelEntity.point = {
                    pixelSize: 2,
                    outlineColor: Cesium.Color.BLUE,
                    outlineWidth: 2,
                    heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
                }
                var pointDegs = this.transformCartesianArrayToWGS84Array(positions)
                var dis = this.getPositionDistance(pointDegs)

                var txt = ''
                if (dis < 1000) {
                    txt = (dis / 1).toFixed(1) + 'm'
                } else {
                    txt = (dis / 1000).toFixed(2) + 'km'
                }
                _labelEntity.label = {
                    text: txt,
                    show: true,
                    showBackground: true,
                    font: '14px monospace',
                    horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
                    verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
                    pixelOffset: new Cesium.Cartesian2(-40, -10) // left top
                }
                drawLayer.entities.add(_labelEntity)
            }
            this.handlersML = new Cesium.ScreenSpaceEventHandler(this.$viewer.scene.canvas)
            // left
            this.handlersML.setInputAction(movement => {
                var cartesian = this.getCatesian3FromPX(movement.position)
                if (cartesian && cartesian.x) {
                    if (isNew) {
                        isNew = false
                        positions = []
                        dataSourceName = 'DrawToolML' + new Date().getTime()
                        drawLayer = new Cesium.CustomDataSource(dataSourceName)
                        entityLine = drawLayer.entities.add({
                            eventName: 'DrawTool',
                            dataSourceName: dataSourceName,
                            polyline: {
                                positions: new Cesium.CallbackProperty((time, result) => {
                                    return positions
                                }, false),
                                width: 2,
                                material: Cesium.Color.WHITE.withAlpha(0.8),
                                clampToGround: true
                            }
                        })
                        this.$viewer.dataSources.add(drawLayer)
                        positions.push(cartesian.clone())
                    }
                    addInfoPoint(cartesian, dataSourceName)
                    positions.push(cartesian)
                }
            }, Cesium.ScreenSpaceEventType.LEFT_CLICK)

            this.handlersML.setInputAction(movement => {
                var cartesian = this.getCatesian3FromPX(movement.endPosition)
                if (positions.length >= 2) {
                    if (cartesian && cartesian.x) {
                        positions.pop()
                        positions.push(cartesian)
                    }
                }
            }, Cesium.ScreenSpaceEventType.MOUSE_MOVE)
            // right
            this.handlersML.setInputAction(movement => {
                if (positions.length === 0) return
                positions.pop()
                entityLine.polyline.positions = positions // 解决不能删除单根线的问题
                if (positions.length < 2) {
                    this.$viewer.dataSources.remove(drawLayer, true)
                }
                this.offToolML()
                this.onToolML()
            }, Cesium.ScreenSpaceEventType.RIGHT_CLICK)
        },
        offToolML() {
            if (this.handlersML) {
                this.handlersML.destroy()
                this.handlersML = null
            }
        }
    }
}
